<template>
    <div>
        <el-container>
            <el-header class="layout-header"><h1>超越电子商务系统</h1></el-header>
            <el-container class="layout-body">
                <el-aside class="layout-aside">
                    <el-menu
                            router
                            class="el-menu-vertical-demo"
                            background-color="#545c64"
                            text-color="#fff"
                            active-text-color="#ffd04b">

                        <el-submenu index="/manage">
                            <template slot="title">
                                <i class="el-icon-user"></i>
                                <span>业务设置</span>
                            </template>
                            <el-menu-item index="/manage/product/list">
                                <i class="el-icon-set-up"></i>
                                <span slot="title">商品管理</span>
                            </el-menu-item>
                            <el-menu-item index="/manage/categorys/list">
                                <i class="el-icon-set-up"></i>
                                <span slot="title">分类管理</span>
                            </el-menu-item>
                            <el-menu-item index="/manage/order/list">
                                <i class="el-icon-circle-plus-outline"></i>
                                <span slot="title">订单管理</span>
                            </el-menu-item>
                            <el-menu-item index="/manage/purchase/list">
                                <i class="el-icon-circle-plus-outline"></i>
                                <span slot="title">采购管理</span>
                            </el-menu-item>
<!--                            <el-menu-item index="/manage/count/list">-->
<!--                                <i class="el-icon-circle-plus-outline"></i>-->
<!--                                <span slot="title">统计管理</span>-->
<!--                            </el-menu-item>-->
                        </el-submenu>

                        <el-submenu index="/admin">
                            <template slot="title">
                                <i class="el-icon-user"></i>
                                <span>系统设置</span>
                            </template>
                            <el-menu-item index="/admin/user/list">
                                <i class="el-icon-set-up"></i>
                                <span slot="title">用户管理</span>
                            </el-menu-item>
                            <el-menu-item index="/admin/role/list">
                                <i class="el-icon-circle-plus-outline"></i>
                                <span slot="title">角色管理</span>
                            </el-menu-item>
                            <el-menu-item index="/admin/permission/list">
                                <i class="el-icon-circle-plus-outline"></i>
                                <span slot="title">权限管理</span>
                            </el-menu-item>
                        </el-submenu>

                    </el-menu>
                </el-aside>
                <el-main>
                    <router-view/>
                </el-main>
            </el-container>
        </el-container>
    </div>
</template>

<style>
    * {
        margin: 0;
        padding: 0;
    }

    .layout-header {
        background: #2d2a2a;
        color: #fff;
    }

    .layout-header h1 {
        line-height: 60px;
    }

    .layout-body {
        position: absolute;
        top: 60px;
        bottom: 0;
        left: 0;
        right: 0;
    }

    .layout-aside {
        background: #545c64;
        color: #fff;
    }
</style>
